<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>管理员信息</title>
        <!-- 记得要写成 /css/public/header.css -->
        <!-- css/public/header.css 前边有个斜杠，说明是相对于根目录的 -->
        <link rel="stylesheet" href="/bootstrap-4.3.1-dist/css/bootstrap.min.css">
        <link rel="stylesheet" href="/css/public/header.css">
        <link rel="stylesheet" href="/css/public/prolist.css">
        <link rel="stylesheet" href="/css/product.css">
        <script src="/js/jquery-3.3.1.min.js"></script>
        <script src="/bootstrap-4.3.1-dist/js/bootstrap.min.js"></script>
    </head>
    <body>
        <%- include public/header.html %>
        <div class="main-content">
            <%- include public/leftU.html %>

            <div class="product-page">
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                        <li class="breadcrumb-item"><a href="#">联系管理员</a></li>
                    </ol>
                </nav>
                <div class="card mb-3" style="width: 100%;">
                    <div class="card-header">搜索</div>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item" style="display:flex;justify-content:space-between;align-items:center;">
                            <form class="form-inline" enctype="multipart/form-data" action="/room/search" method="GET">
                                    名称
                                <input type="text" class="form-control mx-2" name="name" placeholder="input ProductName">
                                <input type="submit" class="form-control" value="开始搜索">
                            </form>
                            <div>
                                <a href="/room/previous" class="btn btn-success mr-2">上一页</a>
                                <a href="/room/next" class="btn btn-danger">下一页</a>
                            </div>
                        </li>
                    </ul>
                </div>
                <!--------------------------------------------------------------------------------------------------------------------------->
                <div class="card text-center">
                    <div class="card-header">
                      <ul class="nav nav-tabs card-header-tabs">
                        <li class="nav-item">
                          <a class="nav-link active" aria-current="true" href="#">管理员</a>
                        </li>

                      </ul>
                    </div>
                    <div class="card-body">
                      
                        <table class="table table-light table-striped">
                            <thead>
                                <tr>
                                    <th class="text-center" scope="col">序号</th>
                                <th class="text-center" scope="col">名字</th>
                                <th class="text-center" scope="col">联系方式(电子邮箱)</th>
                                
                                </tr>
                            </thead>
                            <tbody>
                                <% list.map((el,index)=>{ %>
                                    <tr class="protop">
                                        <th class="text-center proitem" scope="row"><%= index+1 %></th>
                                        <td class="text-center proitem"><%= el.name %></td>
                                        <td class="text-center proitem"><%= el.email %></td>
                                    </tr>
                                <% }) %>                                                                
                            </tbody>
                        </table>

                    </div>
                    
                  </div>
                  <div class="card mb-3" style="margin-left: 20px;min-width: 20%">
                    <div class="card-header">
                      账户信息
                    </div>
    
                  </div>
                  <!---------------------------------------------------------------------------------------------------------------------------------->

                <!------------------------------------------------------------------------------------------------------------------------------------>
            </div>
            
        </div>
    </body>
</html>